<?php

/* @var $this yii\web\View */
/* @var $searchModel app\models\PostSearch */
/* @var $dataProvider yii\data\ActiveDataProvider */

$this->title = Yii::t('app', 'Posts');
$this->params['breadcrumbs'][] = $this->title;
?>

<link href="/kendoui/styles/kendo.common.min.css" rel="stylesheet">
<link href="/kendoui/styles/kendo.bootstrap.min.css" rel="stylesheet">
<script src="/kendoui/js/angular.min.js"></script>
<script src="/kendoui/js/kendo.web.min.js"></script>
<script>
	$(function(){
		$("#size").kendoComboBox();			
	});

	$(document).ready(function () {
        $("#grid").kendoGrid({
            dataSource: {
                type: "odata",
                transport: {
                    read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers"
                },
                pageSize: 20
            },
            height: 550,
            groupable: true,
            sortable: true,
            filterable: true,
            pageable: {
                refresh: true,
                pageSizes: true,
                buttonCount: 5
            },
            columns: [{
                field: "ContactName",
                title: "Contact Name",
                width: 200,
                filterable: true,
            }, {
                field: "ContactTitle",
                title: "Contact Title"
            }, {
                field: "CompanyName",
                title: "Company Name"
            }, {
                field: "Country",
                width: 150
            }]
        });
    });
</script>
<div class="post-index">

   POST INDEX
	
	 <select id="size" placeholder="Select size...">
				        <option>X-Small</option>
				        <option>Small</option>
				        <option>Medium</option>
				        <option>Large</option>
				        <option>X-Large</option>
				        <option>2X-Large</option>
			        </select>
</div>

<div style="height:1000px;"><div id="grid"></div></div>